<template>
  <header class="header">
    <h1>todos</h1>
    <input 
    :checked='isShow'
    @click="isShowFn" 
    id="toggle-all" 
    class="toggle-all" 
    type="checkbox" >
    <label for="toggle-all"></label>
    <input
      class="new-todo"
      placeholder="输入任务名称-回车确认"
      autofocus
      v-model="value"
      @keydown.enter="addTask"
    />
  </header>
</template>

<script>
import { mapGetters } from 'vuex'
export default {
data(){
  return{
    value:''
  } 
},
computed:{
...mapGetters(['isShow'])
},
methods:{
  addTask(){
    this.$store.commit('addtask',this.value)
    this.value = ''
  },
  isShowFn() {
    this.$store.commit('setIsShow')
  },
}
}
</script>
